<template>
  <section class="page">
    <headerbar>通知公告
      <span v-if="!noticeType" class="head-btn" @click="goDetail()" slot="btn">通知情况</span>
    </headerbar>

    <section class="inner-content">
      <section class="detail">
        <h1 class="title">{{data.title}}</h1>
        <p class="date">{{getTime(data.createTime)}} <span class="pull-right">发送者：{{data.senderName}}</span></p>
        <p class="line"></p>
        <div class="cont-text">
         {{data.nodeMsg}}
        </div>
        <p class="title" style="margin-top: 20px;" v-if="files && files.length>0">附件：</p>
        <div class="text-center no-data" v-if="false && files.length===0">
          <img src="../../../../static/images/no_data.png" alt="">
          <p>暂无数据</p>
        </div>
        <ul class="list-item mui-content-padded flex-justify-start" v-if="files && files.length>0">
          <li class="enclosure-upload" v-for="item in files">
            <img v-if="isImage(item.fileName)" class="enclosure-upload-file" :src="imgUrl(item.fileId)" @click="showImagePreview(item)"/>
            <img v-if="!isImage(item.fileName)" class="enclosure-upload-file" src="../../../../static/images/up_document.png" @click="downLoadFile(item)" />
            <p class="mui-ellipsis">{{item.fileName}}</p>
          </li>
        </ul>
        <p v-if="data.msgType ==='zzsh'" @click="goDetailsanhuiyike(data)" class="party-detail">查看详情 > ></p>
      </section>
    </section>
  </section>
</template>

<script>
  import tools from '@/utils/tools'
  import api from '@/common/config/api'
  import loginService from '@/service/loginService'
  import moment from 'moment'

  export default {
    name: 'noticeNoticeDetail',
    data () {
      return {
        fn: tools,
        data: {},
        msgId: '',
        files: [],
        attachmentList: [],
        noticeType: true,
        tabIndex: '0',
        feedType: false ,//是否需要反馈
        userInfo:'',
      }
    },
    created () {
      this.userInfo = this.$localStorage.get('userInfo')
      this.msgId = this.$route.params.msgId
      this.tabIndex = this.$route.params.tabIndex
      this.noticeType = this.$store.state.showFeedback
      this.loadData()
      /*this.data ={
        "id":"2120d229e03a41a0b01dc5a0bed335af","title":"党史知识学习竞答活动","msgType":"tzgg","msgTypeName":"通知公告","dataScope":"custom","orgScope":"0","senderName":"筑红云","sendOrigin":"2","nodeMsg":"“学党史 悟思想 铸忠诚”党史知识学习竞答活动第一期竞答于4月15日-25日开放，点击首页轮播图活动入口即可进入答题页面，期待您的参与！","feedBack":"0","mustRead":"0","sendSms":"1","showFlag":"1","appShow":null,"createUser":"1","createTime":1621929423000,"createDate":null,"annexList":[],"laterHourFeedback":0.0
      }*/
      // this.optNodeMsgRead()
    },
    methods: {
      async loadData () {
        let data = {
          loginId: '3750',
          msgId: this.msgId
        }
        if (this.tabIndex === '1') {
          data.viewType = 'mySendList'
        }
        await this.getUserResultInfo();
        this.fetchService.nodeMsgDetail(data).then(res => {
          if (res.code !== 0) {
            return tools.tip(res.message)
          }
          this.data = res.data
          this.files = this.data.annexList
          // if (this.data.readResult === '0') {
          //   this.optNodeMsgRead()
          // }
          let oldtime = this.data.createTime+this.data.laterHourFeedback*60*60*1000
          // console.log('this.tools.formatDataUtil(this.data.createTime,new Date())=',this.tools.formatDataUtil(new Date(),oldtime,'s'));
          // if (this.data.feedResult && this.data.feedResult === '0') {
          if (this.data.msgType ==='zzsh' && this.data.feedBack === '1' && this.feedType === '0') {
            if(this.data.laterHourFeedback === 0){//反馈时间
              this.showDialog()
            }
            if(this.data.laterHourFeedback > 0 && this.tools.formatDataUtil(new Date(),oldtime,'s')>0){
              this.showDialog()
            }
          }else if (this.data.feedBack === '1' && this.feedType === '0' && this.tools.formatDataUtil(new Date(),oldtime,'s')>0) {
            // this.$store.state.showFeedback = false
            this.showDialog()
          }
          console.log('---------this.data.annexList=', this.data.annexList.length)
        })
      },
      async getUserResultInfo(){
        let data = {
          userId: this.userInfo.id,
          msgId: this.msgId
        }
        await this.fetchService.getUserResultInfo(data).then(res => {
          console.log(res.data);
          this.feedType = res.data.feedType
        })
      },
      getTime (createTime) {
        return moment(createTime).format('YYYY年MM月DD日')
      },
      showImg (fileId) {
        let fileUrl = this.tools.getImgUrl(fileId)
        console.log('-------------fileUrl=', fileUrl)
        return fileUrl
      },
      go () {
        this.$router.push({path: `/feedback/${this.data.id}`})
      },
      isImage (fileName) {
        let arrExt = fileName.split('.')
        return 'PNG,JPG,JPEG,BMP,GIF'.split(',').indexOf(arrExt[arrExt.length - 1].toUpperCase()) > -1
      },
      downLoadFile (item) {
        console.log("item={}", item)
        let url = this.tools.getImgUrl(item.fileId)
        if (window.android && window.android.downloadFile) {
          window.android.downloadFile(url, item.fileName)
        }
      },
      imgUrl (fileId) {
        return this.tools.getImgUrl(fileId)
      },
      showImagePreview (item) {
        if (item.fileId.length < 1) {
          return false
        }
        let fileUrl = this.tools.getImgUrl(item.fileId)
        item.url = fileUrl
        let imgs = [fileUrl]
        this.$createImagePreview({
          initialIndex: 0,
          imgs: imgs
        }, (h) => {
          return h('div', {
            class: {
              'image-preview-custom-header': false
            },
            slot: 'header'
          }, '')
        }).show()
      },
      showDialog () {
        let me = this
        this.$createDialog({
          type: 'confirm',
          icon: '',
          title: '温馨提示',
          content: '该通知需要反馈给发送方信息',
          confirmBtn: {
            text: '取消',
            active: false,
            disabled: false,
            href: 'javascript:;'
          },
          cancelBtn: {
            text: '反馈',
            active: true,
            disabled: false,
            href: 'javascript:;'
          },
          onCancel: () => {
            me.goFeedback()
          }
        }).show()
      },
      goFeedback () {
        this.$createFeedbackDialog({
          $props: {
            msgId: this.msgId,
            msgType: this.data.msgType
          }
        })
//        this.go()
      },
      goDetail () {
        this.$router.push({path: `/noticeNoticePeople/${this.msgId}`})
      },
      goDetailsanhuiyike (data) {
        this.fetchService.meet_getMeetIdByMsgId(this.msgId).then(res => {
          console.log('meet_getMeetIdByMsgId',res.data);
          this.$router.push({ path: `/sanhuiyikeDetail/${res.data.entityId}`, query:{fromType: 'zzsh'} });
        })
      },
      optNodeMsgRead () {
        let data = {
          msgId: this.msgId
        }
        this.fetchService.optNodeMsgRead(data).then(res => {
        })
      }
    }
  }
</script>

<style scoped lang="scss">
  .detail .cont-text {
    font-family:dang;
  }
  .party-detail{
    color: #0f9ceb;
    line-height: 2em;
    font-size: 16PX;
  }
</style>
